<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:c="http://java.sun.com/jsp/jstl/core">
    <ui:composition> 
        <p:panel  header="Mantenimiento de usuarios" style="text-align: center;margin-bottom:10px;">
            <h:form id="form">
                <p:dataTable var="user" value="#{backofficeUserManagedBean.allUsers}" rowKey="#{user.email}" paginator="true" rows="15"  
                              selection="#{backofficeUserManagedBean.selectedUser}" selectionMode="single" filteredValue="#{backofficeUserManagedBean.filteredUsers}" id="usersTable">  

                    <p:ajax event="rowSelect" update=":form:display" oncomplete="userDialog.show()"/>  
                    
                    <p:column headerText="Email" sortBy="#{user.email}" filterBy="#{user.email}" id="email" filterMatchMode="contains">  
                        #{user.email}  
                    </p:column>  

                    <p:column headerText="Nombre" sortBy="#{user.name}" filterBy="#{user.name}" id="name" filterMatchMode="contains">  
                        #{user.name}  
                    </p:column>  

                    <p:column headerText="Apellidos" sortBy="#{user.surname}" filterBy="#{user.surname}" id="surname" filterMatchMode="contains">  
                        #{user.surname}  
                    </p:column>  
                    <c:set value="#{utilsBean.statusToString(user.status)}" var="stat"/>
                    <p:column headerText="Estado" sortBy="#{stat}" filterBy="#{stat}" id="status" filterOptions="#{utilsBean.statusList()}"  
                              filterMatchMode="exact" style="text-align: center">  
                        #{stat}
                    </p:column>  

                </p:dataTable>  

                <p:dialog header="Detalles del usuario" widgetVar="userDialog" resizable="false"  
                          width="280" showEffect="clip" hideEffect="explode">  

                    <h:panelGrid id="display" columns="2" cellpadding="4" >  

                        <h:outputText value="Email" />  
                        <h:outputText value="#{backofficeUserManagedBean.selectedUser.email}" id="aEmail" style="font-weight: bold"/>  

                        <h:outputText value="Nombre" />  
                        <h:outputText value="#{backofficeUserManagedBean.selectedUser.name}" id="aName"  style="font-weight: bold"/>  

                        <h:outputText value="Apellidos" />  
                        <h:outputText value="#{backofficeUserManagedBean.selectedUser.surname}" id="aSurname"  style="font-weight: bold"/>  

                        <h:outputText value="Dirección" />  
                        <h:outputText value="#{backofficeUserManagedBean.selectedUser.address}" id="aAddress"  style="font-weight: bold"/>  
                        
                        <h:outputText value="Telefono" />  
                        <h:outputText value="#{backofficeUserManagedBean.selectedUser.phone}" id="aPhone"  style="font-weight: bold"/>  
                        
                        <h:outputText value="Permiso" />  
                        <c:set value="#{utilsBean.permissionToString(backofficeUserManagedBean.selectedUser.permission)}" var="aPer"/>
                        <h:outputText value="#{aPer}" id="aPermission"  style="font-weight: bold"/> 
                        
                        <h:outputText value="Estado" />  
                        <c:set value="#{utilsBean.statusToString(backofficeUserManagedBean.selectedUser.status)}" var="aStat"/>
                        <h:outputText value="#{aStat}" id="aStatus"  style="font-weight: bold"/>
                        
                       
                        <p:commandButton value="Cerrar" onclick="userDialog.hide()"/>
                        <p:commandButton value="Modificar" ajax="false" style="margin-left: 50px" actionListener="#{backofficeUserManagedBean.goToDetails(backofficeUserManagedBean.selectedUser)}"/>
                    </h:panelGrid>  
                </p:dialog>  
            </h:form>
        </p:panel>
    </ui:composition>

</html>